<template>
  <div>
    <rolesaveupdate ref="su" @showTable="init"></rolesaveupdate>
    <etable ref="eTable" :columns="columns"
            easySearchPlaceholder="角色名" :tools="['easySearch','refresh','export']" @btnClick="handClick">
      <div slot="buttons">
        <Button type="primary" @click="add">新增</Button>
      </div>
    </etable>
  </div>
</template>

<script>
import etable from '@/components/easy-table/easy-table.vue'
import rolesaveupdate from './role-save-update'
import { saveRoleAuthority, deleteRole } from '../../../api/sys/role'

export default {
  name: 'role',
  components: {
    etable,
    rolesaveupdate
  },
  data () {
    return {
      url: '/sys/role/list?',
      data1: [],
      selectRow: {},
      columns: [
        {
          title: '角色ID',
          key: 'roleId',
          align: 'center',
          minWidth: 60
        },
        {
          title: '角色名称',
          key: 'roleName',
          align: 'center',
          minWidth: 100
        },
        {
          title: '别称',
          key: 'remark',
          align: 'center',
          minWidth: 100
        },
        {
          title: '操作',
          key: 'handle',
          align: 'center',
          width: 140,
          options: ['edit', 'delete']
        }
      ]
    }
  },
  methods: {
    save () {
      let checked = []
      this.getSelectMenu(this.data1, checked)
      this.selectRow.menu = checked
      saveRoleAuthority(this.selectRow).then(res => {
        if (res.code === 200) {
          this.$Message.success('保存成功')
        }
      })
    },
    add () {
      this.$refs['su'].showAdd()
    },
    handClick (name, param) {
      if (name === 'edit') {
        let roleId = param.row.roleId
        this.$refs['su'].showEdit(roleId)
      } else if (name === 'delete') {
        deleteRole(param.row.roleId).then(res => {
          if (res.code === 200) {
            this.$Message.success('删除成功')
            this.init()
          }
        })
      }
    },
    init () {
      this.$refs['eTable'].init(this.url)
    }
  },
  mounted () {
    this.init()
  }
}
</script>

<style>

</style>
